import 'package:flutter/material.dart';
import 'package:flutter_plant_ui/constants.dart';

class TitleWidthMoreBtn extends StatelessWidget {
  const TitleWidthMoreBtn({Key key, this.title, this.press}) : super(key: key);
  final String title;
  final Function press;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: kDefaultPadding),
      child: Row(
        children: [
          TitleWithCustomUnderLine(text: title),
          Spacer(),
          FlatButton(
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(20),
            ),
            color: kPrimaryColor,
            onPressed: press,
            child: Text(
              "More",
              style: TextStyle(color: Colors.white),
            ),
          ),
          // Container(
          //   decoration: BoxDecoration(
          //     color: kPrimaryColor,
          //   ),
          //   child: ClipRRect(
          //     borderRadius: BorderRadius.circular(20),
          //     child: TextButton(
          //       onPressed: press,
          //       child: Expanded(
          //         child: Text(
          //           "More",
          //           style: TextStyle(color: Colors.white),
          //         ),
          //       ),
          //     ),
          //   ),
          // ),
          // ClipRRect(
          //   borderRadius: BorderRadius.circular(20),
          //   child: TextButton(
          //     onPressed: press,
          //     child: Expanded(
          //       child: Container(
          //         padding: EdgeInsets.symmetric(
          //             horizontal: kDefaultPadding,
          //             vertical: kDefaultPadding / 2),
          //         decoration: BoxDecoration(
          //           color: kPrimaryColor,
          //           borderRadius: BorderRadius.circular(20),
          //         ),
          //         child: Text(
          //           "More",
          //           style: TextStyle(color: Colors.white),
          //         ),
          //       ),
          //     ),
          //   ),
          // ),
        ],
      ),
    );
  }
}

class TitleWithCustomUnderLine extends StatelessWidget {
  const TitleWithCustomUnderLine({Key key, this.text}) : super(key: key);
  final String text;

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 24,
      child: Stack(
        children: [
          Padding(
            padding: EdgeInsets.only(left: kDefaultPadding / 4),
            child: Text(
              text,
              style: TextStyle(
                fontSize: 20,
                fontWeight: FontWeight.bold,
              ),
            ),
          ),
          Positioned(
            bottom: 0,
            left: 0,
            right: 0,
            child: Container(
              height: 4,
              margin: EdgeInsets.only(right: kDefaultPadding / 4),
              color: kPrimaryColor.withOpacity(0.2),
            ),
          ),
        ],
      ),
    );
  }
}
